<assign name="page_title" value="提交学生证信息获取注册邀请" />
<assign name="current_item" value="auth" />
<include file="Public:header" />
<div id="main">
    <div id="main-header" class="grid page">
        <h2>爱咕噜</h2>
        <h1>你的私信</h1>
    </div>
    <div id="sub-main-header"></div>
    <div id="main-inner" class="account_settings page grid">
        <h4>提交学生证信息获取注册邀请</h4>
        <p class="gray small">为了防止闲杂人等进入社区，你需要提供有效的学生证明，待验证后，我们将发送邀请邮件到您邮箱，届时请注意查收。</p>
        <form action="__URL__/saveAuth" method="post" enctype="multipart/form-data">
            <table class="edit">
                <tr>
                    <td class="label" width="100">邀请码接收邮箱</td>
                    <td><input class="text" type="text" name="email" id="email" placeholder="常用的Email" style="margin:0" /></td>
                </tr>
            </table>
            <hr class="dash" />
            <table class="edit">
                <tr>
                    <td class="label" width="100">姓名</td>
                    <td>
                        <input class="text" type="text" name="realname" id="realname" value="" placeholder="请填写真实姓名" />
                    </td>
                </tr>
                <tr>
                    <td class="label">所在学校</td>
                    <td>
                        <select name="school_id" id="school-id" class="select">
                            <option value="">选择学校..</option>
                            <volist name="schools" id="vo">
                                <option value="{{$vo.school_id}}" data-photo-count="{{$vo.profile_photo_count}}">{{$vo.school_name}}</option>
                            </volist>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td class="label">学号</td>
                    <td><input class="text" type="text" name="s_number" id="s-number" value="" size="12" /></td>
                </tr>
                <tr>
                    <td class="label">学生证</td>
                    <td>
                        <p>
                            <input class="text silver" type="text" name="photo_value" id="photo-value" readonly="true" /> 
                            <button class="btn btn_silver" type="button" id="btn-photo-change"><span>浏览..</span></button>
                        </p>
                        <p id="photo2-wrap" class="hidden">
                            <input class="text silver" type="text" name="photo2_value" id="photo2-value" readonly="true" /> 
                            <button class="btn btn_silver" type="button" id="btn-photo2-change"><span>浏览..</span></button>
                        </p>
                        <div id="photo-box" class="photo_box">
                            <input class="file photo" type="file" name="photo[]" id="photo"  hidefocus="hidefocus" />
                        </div>
                        <div id="photo2-box" class="photo_box hidden">
                            <input class="file photo" type="file" name="photo[]" id="photo2"  hidefocus="hidefocus" />
                        </div>
                    </td>
                </tr>
                <tr>
                    <td class="label"></td>
                    <td>
                        <p class="silver small">可用手机、数码相机、扫描仪等设备拍摄、扫描一张清晰的证件照片上传</p>
                        <p class="small gray">注: 以上信息 <b>仅用户注册身份验证，将是安全保密的</b>，您不必为个人隐私烦恼。</p>
                        <button class="btn btn_silver fbold" type="submit"><span>提交申请</span></button>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>
<style>
    .photo{
        *filter:alpha(opacity=0);
        -moz-opacity:0;
        opacity:0;
        position:absolute;
        display:block;
        cursor:pointer;
        right: -5px;
        height:27px;
    }
    .photo_box{
        height:27px;
        overflow: hidden;
        width:70px;
        z-index:5;
        position: absolute;
        font-size:8em;
    }
</style>

<script>
    Do(function(){
        $("#photo-box").css({
            "top": $("#btn-photo-change").position().top,
            "left": $("#btn-photo-change").position().left
        }).bind("change",function(){
            $("#photo-value").val($("#photo").val());
        });
        $("#school-id").change(function(){
            var count = $("option:selected",this).attr("data-photo-count");
            $("#photo2-box").bind("change",function(){
                $("#photo2-value").val($("#photo2").val());
            });
            if(count > 1){
                $("#photo2-wrap").show();
                $("#photo2-box").css({
                    "top": $("#btn-photo2-change").position().top,
                    "left": $("#btn-photo2-change").position().left
                }).show();
            }else{
                $("#photo2-wrap").hide();
                $("#photo2-value").val("");
                $("#photo2").val("");
            }
        }).triggerHandler("change");
    });
</script>
<include file="Public:footer" />
